import type { StringOptions } from "@/types"
import { reactive, ref } from "vue"
import { useRoute, useRouter } from "vue-router"
import type { HRBaseInfo } from "../types"

export default function usePageState() {

  // 路由实例
  const route = useRoute()
  const router = useRouter()
  // 响应式数据
  const jobFormRef = ref()
  const tagInputRef = ref()
  const savingDraft = ref<boolean>(false)
  const publishing = ref<boolean>(false)
  const tagInputVisible = ref<boolean>(false)
  const tagInputValue = ref<string>('')
  const publishStatus = ref<string>('draft')

  // 判断是否为编辑模式
  const isEdit = ref(!!route.params.id)

  // 职位表单数据
  const jobForm = reactive({
    title: '',
    department: '',
    location: '',
    employmentType: '',
    seniority: '',
    education: '',
    salaryMin: null,
    salaryMax: null,
    currency: 'CNY',
    description: '',
    requirements: '',
    responsibilities: '',
    benefits: '',
    tagList: [] as string[],
    ownerId: null
  })

  // 表单验证规则
  const jobRules = {
    title: [
      { required: true, message: '请输入职位名称', trigger: 'blur' },
      { min: 2, max: 50, message: '职位名称长度在 2 到 50 个字符', trigger: 'blur' }
    ],
    department: [
      { required: true, message: '请选择所属部门', trigger: 'change' }
    ],
    location: [
      { required: true, message: '请选择工作地点', trigger: 'change' }
    ],
    employmentType: [
      { required: true, message: '请选择工作类型', trigger: 'change' }
    ],
    seniority: [
      { required: true, message: '请选择经验要求', trigger: 'change' }
    ],
    education: [
      { required: true, message: '请选择学历要求', trigger: 'change' }
    ],
    description: [
      { required: true, message: '请输入职位描述', trigger: 'blur' },
      { min: 10, message: '职位描述至少10个字符', trigger: 'blur' }
    ],
    requirements: [
      { required: true, message: '请输入任职要求', trigger: 'blur' },
      { min: 10, message: '任职要求至少10个字符', trigger: 'blur' }
    ],
    responsibilities: [
      { required: true, message: '请输入岗位职责', trigger: 'blur' },
      { min: 10, message: '岗位职责至少10个字符', trigger: 'blur' }
    ],
    ownerId: [
      { required: true, message: '请选择职位负责人', trigger: 'change' }
    ],
    salaryMin: [
      {
        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-function-type
        validator: (rule: any, value: any, callback: Function) => {
          if (value && jobForm.salaryMax && value >= jobForm.salaryMax) {
            callback(new Error('最低薪资不能大于等于最高薪资'))
          } else {
            callback()
          }
        },
        trigger: 'blur'
      }
    ],
    salaryMax: [
      {
        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-function-type
        validator: (rule: any, value: any, callback: Function) => {
          if (value && jobForm.salaryMin && value <= jobForm.salaryMin) {
            callback(new Error('最高薪资不能小于等于最低薪资'))
          } else {
            callback()
          }
        },
        trigger: 'blur'
      }
    ]
  }

  // 下拉选项数据
  const departmentOptions = ref<StringOptions[]>([
    { label: '技术部', value: '技术部' },
    { label: '产品部', value: '产品部' },
    { label: '设计部', value: '设计部' },
    { label: '市场部', value: '市场部' },
    { label: '销售部', value: '销售部' }
  ])

  const locationOptions = ref<StringOptions[]>([
    { label: '北京', value: '北京' },
    { label: '上海', value: '上海' },
    { label: '深圳', value: '深圳' },
    { label: '杭州', value: '杭州' },
    { label: '广州', value: '广州' }
  ])

  const hrUsers = ref<HRBaseInfo[]>([
    {
      id: 1,
      name: '张三',
      roleName: '企业管理员',
      avatar: ''
    },
    {
      id: 2,
      name: '李四',
      roleName: '企业HR',
      avatar: ''
    }
  ])
  return {
    route,
    router,
    jobFormRef,
    tagInputRef,
    savingDraft,
    publishing,
    tagInputVisible,
    tagInputValue,
    publishStatus,
    isEdit,
    jobForm,
    jobRules,
    departmentOptions,
    locationOptions,
    hrUsers
  }
}
